<template>
  <div class="seller">
        <top :seller="seller"></top>
        <router-view></router-view>
        <shop-cart></shop-cart>
  </div>
</template>
<script>
import Top from './top'
import ShopCart from './shopCart'
import {mapGetters} from 'vuex'
export default {
  data () {
    return {
      showCart: true
    }
  },
  computed: {
    ...mapGetters([
      'seller'
    ])
  },
  mounted () {
    console.log('mounted.')
    this.detail()
  },
  created () {
    console.log('created.')
  },
  activated () {
    console.log('activated.')
    this.detail()
  },
  components: {
    Top,
    ShopCart
  },
  methods: {
    detail () {
      this.$router.replace(`/seller/goodsList`)
    },
    enter (el) {
      console.log('seller_enter')
      el.style.transform = 'translateX(100%)'
    },
    afterEnter (el) {
      console.log('seller_after_enter')
      el.style.transition = 'all 1s'
      el.style.transform = 'translateX(0)'
    },
    leave (el) {
      console.log('seller_leave')
      el.style.transform = 'translateX(100%)'
    },
    afterLeave (el) {
      console.log('seller_afterLeave')
    }
  }
}
</script>
<style lang="less" scoped>
.seller {
  position:absolute;
  overflow: hidden;
  z-index: 99;
  height: 100%;
  width:100%;
  background-color: #fff;
  top:0;
  left:0;
}
</style>
